<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Blog</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>

    <!-- 背景div -->
    <div id="mydiv" style="height:vh;"></div>



    <header class="clearfix">
        <h1 class="fl">
        </h1>
        <ul class="nav clearfix fr">
            <li><a href="">Home</a></li>
            <li><a href="./article.html">Article</a></li>
            <li><a href="./tags.html">Tags</a></li>
            <!-- <li><a href="#">首页</a></li> -->
            <!-- <li><a href="#">首页</a></li> -->
        </ul>
    </header>
    <div class="bg">
        <div class="chicken_Soup_for_the_Soul">
            <h1>时间不在于你拥有多少，而在于你怎样使用。</h1>
        </div>
        <div class="scroll_down"></div>
    </div>
    <main class="w clearfix">
        <!-- 侧边栏 -->
        <aside>
            <div class="card card_user">
                <!-- 用户信息 -->
                <div class="user">
                    <div class="photo">
                        <!-- 头像 数据库拿图片地址 -->
                        <img src="" alt="">
                    </div>
                    <!-- 用户名 -->
                    <div id="nickname"></div>
                    <!-- 状态 -->
                    <p class="user_state"></p>
                </div>

                <!-- 博客统计 -->
                <div class="blogs clearfix">
                    <!-- 文章统计 -->
                    <div class="blogs_statistics fl">
                        <a href="./article.html">
                            <div class="headline">Articles</div>
                            <div class="article_length_num"></div>
                        </a>
                    </div>
                    <!-- 标签统计 -->
                    <div class="blogs_statistics fl">
                        <a href="./tags.html">
                            <div class="headline">Tags</div>
                            <div class="tag_length_num"></div>
                        </a>
                    </div>
                </div>
                <!-- 添加到标签页 -->
                <div class="add_to_bookmark">
                    <a href="javascript:;">
                        <i></i>
                        <span>&nbsp; Add To Bookmark</span>
                    </a>
                </div>
            </div>

            <div class="card card_tags">
                <h3><i></i>Tags</h3>
                <div class="card_tag">
                </div>
            </div>

            <div class="card card_archives">
                <h3><i></i>Archives</h3>
                <ul></ul>
                <a href="./article.html">More</a>
            </div>
        </aside>

        <!-- 文章 -->
        <article></article>

    </main>
    <script src="./jquery-3.5.1/jquery-3.5.1.min.js"></script>
    <script src="./js/home.js"></script>
    <script type="text/javascript">
        window.onload = function () {
            //配置
            var config = {
                vx: 4,	//小球x轴速度,正为右，负为左
                vy: 4,	//小球y轴速度
                height: 2,	//小球高宽，其实为正方形，所以不宜太大
                width: 2,
                count: 300,		//点个数
                color: "187, 255, 255", 	//点颜色
                stroke: "142, 229, 238", 		//线条颜色
                dist: 6000, 	//点吸附距离
                e_dist: 10000, 	//鼠标吸附加速距离
                max_conn: 10 	//点到点最大连接数
            }

            //调用
            CanvasParticle(config);
        }
    </script>
    <script src="./js/bg.js"></script>
</body>

</html>